import "./Header.css";
import { PageHeader, Dropdown, message} from "antd";
import { DownloadOutlined, LinkOutlined ,UserOutlined, CommentOutlined} from '@ant-design/icons';
import Wrapper from "../../assets/wrappers/Header";

var store = window.localStorage
var username = store.getItem("UserName")

const items= [

  {
    label: '注销',
    key: '1',
    icon: <UserOutlined />,
  },
  
];
const handleMenuClick = (e) => {
  message.info('注销成功');
  store.setItem("UserName", '')
  window.location.href = "/"
};
const menuProps = {
  items,
  onClick: handleMenuClick,
};

function Header(props) {
  return (
    <Wrapper>
    <PageHeader
      style={{ backgroundColor: '#9ad6e8'}}
      title="Dig-out"
      className="site-page-header"
      extra={[
      <Dropdown.Button menu={menuProps} placement="bottom" icon={<UserOutlined />}>
        {username}
      </Dropdown.Button>,
      ]}
      avatar={{ src: 'https://avatars1.githubusercontent.com/u/8186664?s=460&v=4' }}
    >
    </PageHeader>
    </Wrapper>
  );
}

export default Header;